import React, { Component } from "react";
import { Redirect, Route, Switch } from "react-router-dom";
import memoryUtils from "../../utils/memoryUtils";
import { Layout } from "antd";
import LeftNav from "../../components/left-nav";
import Header from "../../components/header";

import Home from "../home/home";
import Category from "../category/category";
import Product from "../product/product";
import Role from "../role/role";
import User from "../user/user";
import Bar from "../charts/bar";
import Line from "../charts/line";
import Pie from "../charts/pie";
import NotFound from "../not-found/not-found";

const { Footer, Sider, Content } = Layout;

class Admin extends Component {
  state = {};

  render() {
    const user = memoryUtils.user;
    if (!user || !user.id) {
      // 重定向回登录界面
      return <Redirect to="/login" />;
    }
    return (
      // minHeight这里设置可以使底部露出
      <Layout style={{ minHeight: "100vh" }}>
        <Sider>
          <LeftNav />
        </Sider>
        <Layout>
          <Header></Header>
          <Content style={{ backgroundColor: "#fff", margin: 20 }}>
            <Switch>
              {/* 以上都没匹配到，则自动跳转到home页面 */}
              <Redirect from="/" to="/home" exact />
              <Route path="/home" component={Home} />
              <Route path="/category" component={Category} />
              <Route path="/product" component={Product} />
              <Route path="/role" component={Role} />
              <Route path="/user" component={User} />
              <Route path="/charts/bar" component={Bar} />
              <Route path="/charts/line" component={Line} />
              <Route path="/charts/pie" component={Pie} />
              <Route component={NotFound}/>

            </Switch>
          </Content>
          <Footer style={{ textAlign: "center", color: "#ccc" }}>
            推荐使用谷歌浏览器, 可以获得更加页面操作体验
          </Footer>
        </Layout>
      </Layout>
    );
  }
}

export default Admin;
